<template>
  <div>
      <!--工具栏-->
        <el-form :inline="true" size="mini" class="toolbar">
            <el-form-item>
                <el-button type="primary" @click="gotoAdd" >新增</el-button>
            </el-form-item>
        </el-form>
        <!--表格区-->
        <el-table :data="tableData" border style="width: 100%;" size="small">
            <template slot="empty">
                还没有数据呢~ (⊙︿⊙)
            </template>
            <el-table-column prop="sortNumber" label="章序" width="90" align="center">
            </el-table-column>
            <el-table-column prop="name" label="章节名称"  >
            </el-table-column>
            <el-table-column label="锁章状态" width="90" align="center">
                <template  slot-scope="scope" >
                    <i :class="handleStatus(scope.row.lockStatus)"></i>
                </template>
            </el-table-column>
            <el-table-column align="center" label="操作" width="240">
            <template slot-scope="scope" >
                <el-button size="mini" type="primary" plain 
                @click="handleDetails(scope.row.id)">查看</el-button>
                <el-button size="mini" type="warning" plain 
                @click="handleEdit(scope.row.id)">编辑</el-button>
                <el-button size="mini" type="danger"  plain 
                @click="handleDelete(scope.row.id)">删除</el-button>
            </template>
            </el-table-column>
        </el-table>
  </div>
</template>

<script>
export default {
  data () {
    return {
      msg: ''
    }
  },
  methods: {

  }
}
</script>

<style scoped>

</style>
